-
-
Notifications
You must be signed in to change notification settings - Fork 6
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add support for custom light/dark schemes #23
Conversation
Hi @sisp , thanks for the contribution! I was on holiday, hence the late reply. I don't understand this PR, and I think the current options document is confusing for users. We are now mixing the concept of vegalite themes and mkdocs material themes. I would expect the theme to be a vegalite theme (https://github.com/vega/vega-themes). The way this plugin currently works, is that it automatically detects if you're using mkdocs-material with the dark mode, and then select the vegalite theme An alternative solution would be for this plugin to have the Then we still need an option to specify which mkdocs-material schemes are dark, and which are light. Perhaps something like: charts:
scheme: autodetect
mkdocs_material_light_themes:
- default
mkdocs_material_dark_themes:
- slate That way, it's clearer to users what's happening & we're not mixing vegalite themes with mkdocs-material themes. Thoughts? |
I was implicitly mapping Two questions though:
|
I like the decoupling of the vega theme and the mkdocs material, and the nested config structure makes it clear, great idea! You are right about 'autodetect' option not feeling intuitive. This plugin is using vega-embed, which has a mkdocs-charts-plugin/mkdocs_charts_plugin/plugin.py Lines 29 to 30 in 87789f5
mkdocs-charts-plugin/mkdocs_charts_plugin/plugin.py Lines 102 to 107 in 87789f5
And then only overwriting it if mkdocs-material theme is present and has a different color scheme: mkdocs-charts-plugin/mkdocs_charts_plugin/js/mkdocs-charts-plugin.js Lines 170 to 180 in 87789f5
So we can combine the ideas and remain backwards compatible: charts:
vega_theme: default # <-- existing default
vega_theme_dark: dark # <-- existing default. We can explain we will attempt to use this theme if dark mode is preferred/detected.
integrations:
mkdocs_material:
themes_light:
- default
- light
themes_dark:
- slate
- dark Then, we can also add a javascript detection if the users prefers dark mode on the browser or OS (https://stackoverflow.com/questions/56393880/how-do-i-detect-dark-mode-using-javascript) |
Any chance we can finish this one? :) |
Absolutely! Sorry, I had forgotten about it. I'll finish it tomorrow evening. |
82b4b03
to
af21c74
Compare
I've updated the PR to add explicit The current implementation tries to derive the theme in the following order:
When trying to detect |
This is epic! Really well done!
I noticed. Actually |
I did that here btw: #25 Will release soon |
Fantastic! Thanks for the amazing feedback and guidance! 🙏 |
Sorry it took a while. Also updated the |
No problem. Thanks! |
I've added support for custom light/dark schemes when using Material for MkDocs.
Material for MkDocs' default schemes are
default
(light) andslate
(dark). But it is possible to define custom schemes with different names/identifiers. For this case, I've added options to configure these identifiers:Their defaults are
default
andslate
respectively. As before, the fallback for when Material for MkDocs is not used (or especiallydata-md-color-scheme
is not set) is the (configured) light Vega theme.WDYT, @timvink?